import React from "react";
import { NavBar, Space, Toast } from "antd-mobile";
import { SearchOutline, MoreOutline, CloseOutline } from "antd-mobile-icons";
import "./track.scss";
import "../../assest/style/common.css";

export default () => {
  const right = (
    <div style={{ fontSize: 24 }}>
      <Space style={{ "--gap": "16px" }}>
        <SearchOutline />
        <MoreOutline />
      </Space>
    </div>
  );
  const back = () =>
    Toast.show({
      content: "点击了返回区域",
      duration: 1000,
    });

  return (
    <div className="app my-track">
      <NavBar back="返回" onBack={back} className="top">
        我的足迹
      </NavBar>
      <div className="clear flex jc-sb aic bg-fff pl-5 pr-15">
        <span className="flex aic">
          <p className="line">丨</p>
          <p className="date flex aic">2021-08-18</p>
        </span>
        <span className="del">清除</span>
      </div>

      <main>
        <div className="flex aic pl-10 pr-10 detail-box bg-fff">
          <img
            src="https://ts3.cn.mm.bing.net/th?id=ORMS.9551274a9615dbc6279df37ad4e05885&pid=Wdp&w=300&h=156&qlt=90&c=1&rs=1&dpr=1&p=0"
            alt=""
          />
          <div className=" w100p mt-15 pl-15">
            <span className="f14 detail">大鹏所城·古城边11房团建客栈</span>
            <span className="flex total pt-30">
              <p className="f14">&yen;2688</p>
              <p className="f14 price pl-5">人均:141</p>
            </span>
          </div>
        </div>
      </main>
      
      <main>
        <div className="flex aic pl-10 pr-10 detail-box bg-fff">
          <img
            src="https://ts3.cn.mm.bing.net/th?id=ORMS.9551274a9615dbc6279df37ad4e05885&pid=Wdp&w=300&h=156&qlt=90&c=1&rs=1&dpr=1&p=0"
            alt=""
          />
          <div className=" w100p mt-15 pl-15">
            <span className="f14 detail">大鹏所城·古城边11房团建客栈</span>
            <span className="flex total pt-30">
              <p className="f14">&yen;2688</p>
              <p className="f14 price pl-5">人均:141</p>
            </span>
          </div>
        </div>
      </main>

      <main>
        <div className="flex aic pl-10 pr-10 detail-box bg-fff">
          <img
            src="https://ts3.cn.mm.bing.net/th?id=ORMS.9551274a9615dbc6279df37ad4e05885&pid=Wdp&w=300&h=156&qlt=90&c=1&rs=1&dpr=1&p=0"
            alt=""
          />
          <div className=" w100p mt-15 pl-15">
            <span className="f14 detail">大鹏所城·古城边11房团建客栈</span>
            <span className="flex total pt-30">
              <p className="f14">&yen;2688</p>
              <p className="f14 price pl-5">人均:141</p>
            </span>
          </div>
        </div>
      </main>
      <div className="no-more pt-20">没有更多了 </div>
    </div>
  );
};
